'use strict'
import { App, ListView, View } from '../../../component'
import style from './css.css'
import RecordList from './recordList'
import setTitle from '../../../config/setTitle'
import { observer, inject } from 'mobx-react'

@inject('user') @observer class Record extends React.Component {
  static propTypes = {
    user: PropTypes.object,
    history: PropTypes.object
  }

  componentDidMount () {
    setTitle('抓中记录')
  }
  _renderList () {
    const list = this.props.user.recordList
    if (!list) {
      this.props.user.getRecordList()
      return
    }
    if (list.length > 0) {
      return (
        <ListView
          className={style.listView}
          layoutClassName={style.recordWrap}
          dataSource={list}
          Item={RecordList}
          itemProp = {{ history: this.props.history }}
          ItemKey={'round_id'}
          topRefresh={(cb) => { this.props.user.getRecordList(cb) }}
        >
        </ListView>
      )
    }
    else {
      return (
        <View className={style.recordWrap}>
          <View className={style.recordWrapNo}>
            暂无抓中记录
          </View>
        </View>
      )
    }
  }

  render () {
    return (
      <App noSysScroll={false}>
        <View className={style.GetRecord}>
          {this._renderList()}
        </View>
      </App>
    )
  }
}

export default Record
